<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<div id="app"></div>
<script src="../node_modules/@vue/runtime-dom/dist/runtime-dom.global.js"></script>
<script>
    let {createApp, h, reactive} = VueRuntimeDom
    let App = {
        setup() {
            let state = reactive({
                name: "szx"
            })

            function changeName() {
                state.name = "songzx"
                state.name = "szx"
                state.name = "songzx"
            }

            return () => {
                return h(
                    "div",
                    {style: {color: "red"}, onClick: changeName},
                    [
                        h(
                            "h2",
                            {style: {color: "blue"}},
                            [
                                "hello world",
                                h(
                                    "b",
                                    {style: {color: "pink"}},
                                    "123"
                                )
                            ]
                        ),
                        state.name
                    ])
            }
        },
    }
    let app = createApp(App, {name: "李四", age: 18})
    app.mount("#app")
</script>
</body>
</html>
